<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8"/>
		<title></title>
	</head>
	<script type="text/javascript" src="js/jquery.js" ></script>
	<script type="text/javascript" src="js/jsgrid.min.js" ></script>
	<link rel="stylesheet" href="css/jsgrid-theme.min.css" />
	<link rel="stylesheet" href="css/jsgrid.min.css" />
	<style>
		#Department{
			position: absolute;
	 		top: 60px;
	 		left:350px;
	 		width:900px;
			margin:10px auto 5px auto;
			clear:both;
			
		}
		.title_1{
			text-align:center;
			width:80px;
			left: 30px;
			font-family: 隶书;
			font-size: 25px;
			}
		.title_2{
			text-align:center;
			width:80px;
			font-family: 隶书;
			font-size: 25px;
			}
		.title_3{
			text-align:center;
			width:80px;
			font-family: 隶书;
			font-size: 25px;
			}
		.title_4{
			text-align:center;
			width:80px;
			font-family: 隶书;
			font-size: 25px;
			}
		.title_5{
			
			text-align:center;
			width:80px;
			font-family: 隶书;
			font-size: 25px;
			}
		.title_6{
			
			text-align:center;
			width:80px;
			font-family: 隶书;
			font-size: 25px;
			
			}
		
		.cart_td_1{
		
			border-bottom:solid 1px #d1ecff;
			border-top:solid 1px #d1ecff;
			text-align:center;
			padding:0px;
			width: 80px;
		}
		.del{
			width: 80px;
			font-size: 20px;
			height: 30px;
			padding: 5px;
			background-color:rgb(0,128,192) ;
			color: white;
			border-top-right-radius: 5px; 
			border-top-left-radius: 5px; 
			border-bottom-right-radius:5px;
			border-bottom-left-radius:5px;
		}
	</style>
	
	<body>
		<div th:replace="Top :: head"></div>
		<div th:replace="Top :: left"></div>
		<div id="Department">
			<a style="color: white;" th:href="DepaAddOneht"><button style="background: rgb(48,54,67)" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">添加部门</button></a>

			<table style="background: rgb(48,54,67);color: white;height: 50px;" width="1100px" border="1" cellspacing="1" cellpadding="0" id="shopping" >
			    <tr>
			        <td class="title_1">部门编号</td>
			        <td class="title_2" >部门名称</td>
			        <td class="title_3">部门负责人</td>
			        <td class="title_4">部门电话</td>
			        <td class="title_5">部门地址</td>
			        <td class="title_6">操作</td>
			    </tr>
			</table>
			<table th:each="depa:${depa}" width="1100px" border="1" cellspacing="0" cellpadding="0" >
			    <tr>
			        <td colspan="6" class="line"></td>
			    </tr>		            
			    <tr >		            	
			        <td class="cart_td_1" th:text="${depa.d_id}"></td>
			        <td class="cart_td_1" th:text="${depa.d_name}"></td>
			        <td class="cart_td_1" th:text="${depa.d_principal}"></td>
			        <td class="cart_td_1" th:text="${depa.d_phone}"></td>
			        <td class="cart_td_1" th:text="${depa.d_address}"></td>
			        <td class="cart_td_1">
			        	
			            <!--修改信息模块-->
			            <a style="color: white;" th:href="@{DepaupdateOne?(id=${depa.d_id})}"><button class="btn btn-primary btn-lg updateOne" data-toggle="modal" data-target="#myModal" style="width: 80px;font-size: 20px;height: 30px;padding: 5px;background: rgb(48,54,67)" >修改</button></a>
							
				
			            <p></p>
			            <input style="background: rgb(48,54,67)" class="del" th:id="${depa.d_id}" type="button" value="删除"/>
			             <p></p>
			        </td>
			    </tr>
			</table>
		</div>
	</body>
	<script>
		$(function(){
			
			$(".del").bind('click',function(){
				alert("你真的要删除吗？？?")
				
		        var id= $(this).attr('id'); 
		        //alert(id)
			    $.ajax(
			    	{
				       	type:"get",
				       	dataType:"json",
				       	url:"DepadeleteOne",
				       	async:"true",
				       	data:{id:id},
			    	}),
	    			$(this).parent().parent().remove();//删除当前tr
	    			productCount(); 
	    			alert("删除成功");
			      });
			
			
		/*	$(".addone").bind('click',function(){
				var data=$(this).parent().prev().children().children().Input().val();
				alert(data);
			})
			*/
			/*$(".updateOne").bind('click',function(){
		 	 var id= $(this).attr('id'); 
				 alert(id)
				  $.ajax(
			    	{
				       	type:"get",
				       	dataType:"json",
				       	url:"updateOne",
				       	async:"true",
				       	data:{id:id},
			    	})
			

		 })
		 	*/
			
		}) 
		 
	</script>
	
</html>



